import React, { Component } from 'react'
import { Grid } from 'antd-mobile';

class Avatar extends Component {
    render() {
        const imgArr = ['avatar1','avatar2','avatar3',
        'avatar4','avatar5','avatar6','avatar7','avatar8','avatar9','avatar10','avatar11','avatar12'];
        let gridData = imgArr.map(item => {
            return {
                icon:require(`../../assets/img/${item}.png`),
                text:item
            }
        })
        return (
            <div>
                <Grid data={gridData} columnNum={4}
                    onClick={el => {
                        this.props.chooseAvatar(el.text)
                    }}></Grid>
            </div>
        )
    }
}

export default Avatar;